[iOS] AR(拡張現実)アプリ開発用SDK「Wikitude」のセットアップ手順

1 はじめに

本日7月7日は、弊社クラスメソッドの創立記念日です。会社の創立記念日といったら普通、「ブログ投稿」ですよねw

と言うことで、今日は、朝から狂ったようにブログが投稿されており、私のこのブログが本日５２本目です。（まだまだ続くらしい・・・）

最近、Wikitudeを利用して色々試しているのですが、ロケーションベース型ARを作成する際に、このSDKをプロジェクトに組み込む手順が少し込み入っているので、自分用という意味も含めて、ここに纏めておくことにさせてください。

なお、セットアップの手順については、基本的に下記のページに日本語で丁寧に紹介されているのですが、少し古くなってしまっているようで、最新のXcode7.3.1では、うまく動作したいところが少しありました。
ドキュメント WIKITUDE SDK IOS バージョン: 5.1.4

2 プロジェクト作成及びライブラリの追加

(1) プロジェクト作成

最初に、Single View Applicationでプロジェクトを作成します。（プロジェクト名は、ARLocationSampleとしました）

(2) SDKの追加

下記のページよりWikitude SDKをダウンロードします。(2016年6月27日現在のバージョンは、5.1.4です) https://wikitude.grapecity.com/downloads/wikitudesdk

なお、SDKを取得するためには、予めアカウント（トライアルは無料）を作成する必要があります。

ダウンロードしたzipファイルは、解凍すると下記のようになっていますが、この中のFrameworkのフォルダを、先に作成したプロジェクトにコピーします。

コピー後のプロジェクトは次のようになります。

(2) Wikitude SDKの追加

プロジェクト設定のGeneral - Linked Frameworks and Libraries にて先ほどのWikitude SDKフレームワークを追加します。

追加が完了すると、図のようになります。

(3) 必要フレームワークのリンク

続いて、このWikitude SDKから利用されるフレームワークやダイナミックライブラリを追加します。

• Accelerate.framework
• AssetLibrary.framework
• AVFoundation.framework
• CFNetwork.framework
• CoreGraphics.framework
• CoreLocation.framework
• CoreMedia.framework
• CoreMotion.framework
• CoreVideo.framework
• Foundation.framework
• JavaScriptCore.framework
• MediaPlayer.framework
• OpenGLES.framework
• QuartzCore.framework
• Security.framework
• SystemConfiguration.framework
• UIKit.framework
• libc++.tbd
• libz.tbd

全ての追加が終わると、次のようになっているはずです。

(4) リンカーフラグ（-ObjC）

Wikitude SDKには-ObjCリンカーフラグが必要です。 リンカーフラグは、プロジェクトのBuild SettingsタブでOther Linker Flags追加します。

(5) Enable Bitcode

Xcode7.3.1では、Enable BitcodeがデフォルトでYESになっていますが、これをNOに設定する必要があります。

ここまでの作業で、一度コンパイルをしてみてください。 エラーが出なければ、ここまでの作業に問題はありません。

3 ARchitect Worldとの接続

プロジェクトの中でARchitectWorldを次のように配置した場合、ARchitect Viewへの接続は、次のようになります。

self.architectWorldNavigation = 
   [self.architectView loadArchitectWorldFromURL:[[NSBundle mainBundle]
           URLForResource:@"index" 
            withExtension:@"html" 
             subdirectory:@"ArchitectWorld"] withRequiredFeatures:WTFeature_Geo | WTFeature_2DTracking];

4 ViewController

ViewControllerでは、次のような処理を記述します。

• WTArchitectViewの生成
• ARchitect Worldとの接続
• カメラビューの起動と停止(start/stop)
• アプリケーションが非アクティブになった時と、アクティブになった時、ArchitectViewの paused/resumed

上記の処理を記述したViewControllerは次のとおりです。このコードを、ViewController.mに貼り付けるだけで動作します。

#import "ViewController.h"
#import <WikitudeSDK/WikitudeSDK.h>
#import "SecretKey.h" // ライセンスーにキー情報が含まれているためGithubでは公開されておりません。

@interface ViewController ()<WTArchitectViewDelegate>
@property (weak, nonatomic) IBOutlet WTArchitectView *architectView;
@property (nonatomic, weak) WTNavigation *architectWorldNavigation;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    NSError *deviceSupportError = nil;
    if ( [WTArchitectView isDeviceSupportedForRequiredFeatures:WTFeature_2DTracking error:&deviceSupportError] ) {
        self.architectView.delegate = self;
        // SecretKey.hに下記の定義がありますが、Githubには公開されておりません
        // #define WT_LICENSE_KEY @"XXXXXXXXXXX"
        [self.architectView setLicenseKey:WT_LICENSE_KEY];
        self.architectWorldNavigation = [self.architectView loadArchitectWorldFromURL:[[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html" subdirectory:@"ArchitectWorld"] withRequiredFeatures:WTFeature_Geo | WTFeature_2DTracking];

        [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(didReceiveApplicationWillResignActiveNotification:) name:UIApplicationWillResignActiveNotification object:nil];
        [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(didReceiveApplicationDidBecomeActiveNotification:) name:UIApplicationDidBecomeActiveNotification object:nil];

    }
    else {
        NSLog(@"WTArchitectView. Error: %@", [deviceSupportError localizedDescription]);
    }
}

#pragma mark - View Lifecycle

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    [self startWikitudeSDKRendering];
}

- (void)viewDidDisappear:(BOOL)animated {
    [super viewDidDisappear:animated];
    [self stopWikitudeSDKRendering];
}

#pragma mark - Private Methods

- (void)startWikitudeSDKRendering{
    if ( ![self.architectView isRunning] ) {
        [self.architectView start:^(WTStartupConfiguration *configuration) {
        } completion:^(BOOL isRunning, NSError *error) {
            if ( !isRunning ) {
                NSLog(@"WTArchitectView could not be started. Reason: %@", [error localizedDescription]);
            }
        }];
    }
}

- (void)stopWikitudeSDKRendering {
    if ( [self.architectView isRunning] ) {
        [self.architectView stop];
    }
}

#pragma mark - View Rotation

- (BOOL)shouldAutorotate {
    return YES;
}

- (UIInterfaceOrientationMask)supportedInterfaceOrientations {
    return UIInterfaceOrientationMaskAll;
}

- (void)willRotateToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration {
    [self.architectView setShouldRotate:YES toInterfaceOrientation:toInterfaceOrientation];
}

#pragma mark - Notifications

- (void)didReceiveApplicationWillResignActiveNotification:(NSNotification *)notification
{
    dispatch_async(dispatch_get_main_queue(), ^{
        [self stopWikitudeSDKRendering];
    });
}

- (void)didReceiveApplicationDidBecomeActiveNotification:(NSNotification *)notification
{
    dispatch_async(dispatch_get_main_queue(), ^{
        if ( self.architectWorldNavigation.wasInterrupted )
        {
            [self.architectView reloadArchitectWorld];
        }
        [self startWikitudeSDKRendering];
    });
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

@end

5 位置情報の許可

iOS8以降では、位置情報の取得に許可が必要なため、info.plistに次の行を追加します。

<key>NSLocationWhenInUseUsageDescription</key>
<string>Your message goes here</string>

参考:[iOS] 位置情報の取得

6 最後に

今回は、Wikitudeを使用する場合の、プロジェクトの作成手順を纏めてみました。実施のアプリは、殆どARchitect Worldの中で、JavaScriptで書くことができるので、ここまでの作業は、ほぼ共通になると思います。

ARアプリも、モバイルで書けると、まだまだ、新しいアイデアがあるような気もしています。頑張って考えてみます。

[GitHub] Wikitudeプロジェクトの雛形

と言うことで、本日の「祝！創立記念日のブログ投稿」は、まだまだ続きます。 ぜひ、ご確認を

7 参考資料

[Xamarin.iOS] WikitudeでモバイルAR（拡張現実）アプリを作ってみた
Wikitude SDKでロケーションベース型AR、画像認識型ARをアプリに実装！